<!--
 * @Date: 2023-01-12 15:51:23
 * @LastEditors: JackyChen02
 * @LastEditTime: 2023-01-15 21:24:35
-->
<!--
 * @Date: 2023-01-12 15:51:23
 * @LastEditors: JackyChen02
 * @LastEditTime: 2023-01-15 08:41:41
-->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>数据可视化</title>
    <link rel="stylesheet" href="css/index.css" />
  </head>
  <body>
    <header>
      <h1 class="title">可视化展板-Echarts</h1>
      <div class="time">当前时间:</div>
    </header>
    <section>
      <div class="left">
        <div class="panel bar1">
          <h2 class="bar">柱状图-就业行业</h2>
          <div class="chart"></div>
          <div class="pannelIn"></div>
        </div>
        <div class="panel bar3">
          <h2 class="bar">
            折线图-人员变化<a href="javascript:;">2022</a
            ><a href="javascript:;">2023</a>
          </h2>
          <div class="chart"></div>
          <div class="pannelIn"></div>
        </div>
        <div class="panel bar5">
          <h2 class="bar">饼状图-年龄分布</h2>
          <div class="chart"></div>
          <div class="pannelIn"></div>
        </div>
      </div>
      <div class="center">
        <div class="no">
          <div class="hd">
            <div class="hd-left">125811</div>
            <div class="hd-right">104563</div>
          </div>
          <div class="bd">
            <div class="bd-left">需求</div>
            <div class="bd-right">供给</div>
          </div>
        </div>
        <div class="map">
          <div class="map1"></div>
          <div class="map2"></div>
          <div class="map3"></div>
          <div class="map4"></div>
        </div>
      </div>
      <div class="right">
        <div class="panel bar2">
          <h2 class="bar">柱状图-技能掌握</h2>
          <div class="chart"></div>
          <div class="pannelIn"></div>
        </div>
        <div class="panel bar4">
          <h2 class="bar">折线图-播放量</h2>
          <div class="chart"></div>
          <div class="pannelIn"></div>
        </div>
        <div class="panel bar6">
          <h2 class="bar">饼状图-地区分布</h2>
          <div class="chart"></div>
          <div class="pannelIn"></div>
        </div>
      </div>
    </section>

    <script src="js/flexible.js"></script>
    <script src="js/echarts.min.js"></script>
    <script src="js/china.js"></script>
    <script src="js/index.js"></script>
  </body>
</html>
